Object-Oriented JavaScript — Tagged Literals and Booleans

JavaScript is partly an object-oriented language.

To learn JavaScript, we got to learn the object-oriented parts of JavaScript.

In this article, we’ll look at strings and booleans, which are the building blocks of objects.

Tagged Template Literals

Tagged template literals is another type of string literals.

They let modify the output of template literals with a function.

The function is called by prefix the template literal with the function.

For instance, we can write:

function transform(strings, ...substitutes) {
  console.log(strings);
  console.log(substitutes);
}

const firstname = "James";
const lastname = "Bond"
transform `Name is ${firstname} ${lastname}`;

transform is the template tag, which is a function that takes a specific set of parameters.

strings is an array of the parts of a string that aren’t in the curly braces.

substitutes have the values that are in the curly braces.

So strings is:

["Name is ", " ", ""]

and substitutes is”

["James", "Bond"]

Booleans

Booleans can only take on one of 2 values.

It can either be true or false .

For instance, if we have:

let b = true;

Then:

typeof b;

returns 'boolean' .

If we put true or false in quotes, then they’re strings.

So if we have:

var b = "true";
typeof b;

Then typeof b is 'string' .

Logical Operators

3 operators work with boolean values.

The ! is the logical NOT operator.

&& is the logical AND operator.

And || is the logical OR operator.

The ! negates the boolean value. So if we have:

let b = !true;

Then b is false .

If we use logical NOT twice, then we get the original value. If we have:

let b = !!true;

then b is true .

If a logical operator is used on a non-boolean value, then the value is converted to a boolean.

If we have:

let b = "foo";

Then !b; is false .

And if we have double negation:

let b = "one";
!!b;

then we get true .

Most values are converted to true with the double negation operator except the following:

• The empty string “”
• null
• undefined
• 0
• NaN
• false

The values above are all falsy.

The && operator returnstrue when both operands are true . Otherwise, it returns false .

The || operator returns true when either of the operands are true . Otherwise, it returns false .

We can use more than one operator in sequence.

For instance, we can write:

true && true && false && true;

and we get false .

And:

false || true || false;

and we get true .

If we mix || and && in one expression, then we should add parentheses.

For instance, we can write:

false && (false || true) && true;

we get false .

Operator Precedence

Operators have precedence.

The arithmetic follows the same rules as in math.

So if we have:

1 + 2 * 3;

we get 7 because multiplication comes first.

For logical operators, ! has the highest precedence and it’s run first.

Then comes && and || .

So:

false && false || true && true;

is the same as:

(false && false) || (true && true);

Conclusion

We should be aware of operator precedence with operators.

Also, there are several operators we should be aware of.